For example , I have three input mode (Chinese , Japanese , English) When I input at the type = "password" , only English can be used and I can't change the input mode. Now I want my textbox like this but not use type = "password",only english mode can be used , how can I do it ?
it is a component that you use everywhere
const MultiLangualInput= ({lan}) => {
const EnglishMode = (event) => {
let flag = false;
var cahrcode = event.charCode;
flag = (cahrcode == 32) ||
(48 <= cahrcode && cahrcode <= 57) ||
(65 <= cahrcode && cahrcode <= 90) ||
(97 <= cahrcode && cahrcode <= 122);
if (!flag)
event.preventDefault();
}
const otherLanguage = (event) => {
console.log(event.charCode)
let flag = false;
var cahrcode = event.charCode;
flag = (cahrcode == 32) ||
(48 <= cahrcode && cahrcode <= 57) ||
(65 <= cahrcode && cahrcode <= 90) ||
(1570 <= cahrcode && cahrcode <= 1594);
if (!flag)
event.preventDefault();
}
return (
<Input onKeyPress={lan==='en'?EnglishMode:otherLanguage}>
</Input>
);
};
export default MultiLangualInput;
Like this:
const App = () => {
return (
<MultiLangualInput lan='en'>
</MultiLangualInput>
);
};
If I understand correctly something like this should work
in your HTML
<textarea name="textarea" rows="10" cols="50">Write something here</textarea>
in Javascript
let text = document.querySelector('textarea');
const pattern = /^[a-zA-Z0-9()*_\-!#$%^&*,."\'\][]+$/;
text.addEventListener('keyup',()=>{
if(!pattern.test(text.value)) {
alert('please use only latin letters')
}
})```